import Vue from 'vue'
import VueRouter from 'vue-router'
import HomeView from '../views/HomeView.vue'
import {getMenuApi} from "@/request/api";
import store from '@/store'
import {listToTree} from "@/util/treeUtil";

Vue.use(VueRouter)

//路由列表
const routes = [
    {
        path: '/',
        name: 'mainLayout',
        redirect: '/home',
        component: () => import('@/views/common/MainLayout'),
        children: [
            // {
            //     path: '/home',
            //     name: 'home',
            //     component: () => import('@/views/HomeView')
            // },
            // {
            //     path: '/user',
            //     name: 'user',
            //     component: () => import('@/views/UserView')
            // },
            // {
            //     path: '/role',
            //     name: 'role',
            //     component: () => import('@/views/RoleView')
            // },
            // {
            //     path: '/menu',
            //     name: 'auth',
            //     component: () => import('@/views/AuthView')
            // },
            // {
            //     path: '/student',
            //     name: 'student',
            //     component: () => import('@/views/StudentView')
            // },
            // {
            //     path: '/course',
            //     name: 'course',
            //     component: () => import('@/views/CourseView')
            // },
            // {
            //     path: '/*',
            //     name: 'page404',
            //     component: () => import('@/views/Page404View')
            // }
        ]
    },

    {
        path: '/login',
        name: 'login',
        component: () => import('@/components/LoginView')
    }
]

const router = new VueRouter({
    routes
})

// 路由守卫 拦截一些非法路径的访问
router.beforeEach(async (to, from, next) => {
    let token = window.sessionStorage.getItem("token");
    // 没有token  访问login  next()
    if (!token && to.path == '/login') {
        next();
        return
    }
    // 有token   访问login   -> /home
    if (token && to.path == "/login") {
        next('/home');
        return;
    }
    // 没有token  访问受限资源 -> login
    if (!token && to.path !== '/login') {
        next("/login");
        return
    }

    if (store.state.menuData.length == 0) {
        // 发送异步请求  请求用户的菜单数据
        let {data} = await getMenuApi()
        let menu = data.map(dt => {
            if (dt.isMenu == 0) {
                return {
                    title: dt.title,
                    id: dt.id,
                    pid: dt.pid,
                    icon:dt.icon
                }
            }
            return {
                title: dt.title,
                id: dt.id,
                pid: dt.pid,
                path: dt.path
            }
        })

        // 将菜单数据 挂载成tree
        let treeMenu = [{title: '首页', path: '/home',icon:'el-icon-menu'}, ...listToTree(menu)]
        console.log("treeMenu=", treeMenu)
        //  将用户信息 处理后添加到 vuex 中的menuData
        store.commit("changeMenuData", treeMenu)

        // 动态路由 isMenu==1
        let rts = data.filter(d => d.isMenu == 1).map(dt => {
            return {
                path: dt.path,
                component: () => import('@/views/' + dt.component)
            }
        })

        let newRouter = [
            {path: '/home', component: () => import('@/views/HomeView')},
            ...rts,
            {path: '/*', component: () => import('@/views/Page404View')}

        ]
        //  遍历新路由 实现路由的动态添加
        newRouter.forEach(nrt=>{
            router.addRoute("mainLayout",nrt)
        })
        next(to.path)
        return
    }
    next();
})

export default router
